<template>

  <div class="app-container flex-column">
    <div class="flex-between mt10 mb10">
      <div>

      </div>
      <div>
        <el-button type="primary" @click="NewNotice">新增</el-button>
        <el-button type="primary" :disabled="getindex==-1" @click="EditNotice">编辑</el-button>
        <el-button type="primary" :disabled="getindex==-1" @click="handleDelete">删除</el-button>
      </div>
    </div>

    <div style="flex: 1;overflow: auto;">
      <el-table ref="tables" :data="tableList" height="100%"
        :row-class-name="tableRowClassName" @row-click="getrow" border stripe highlight-current-row>
        <el-table-column label="序号" width="60" header-align="center" align="center" show-overflow-tooltip>
          <template scope="scope">
            <span>{{ (currentpage - 1) * pagesize + scope.$index + 1 }}</span>
          </template>
        </el-table-column>

        <el-table-column label="公告标题" header-align="center" prop="notice_title" show-overflow-tooltip />
        <el-table-column label="公告类型" header-align="center" align="center" prop="notice_type" width="100"
          show-overflow-tooltip>
          <template slot-scope="scope">
            <dict-tag :options="dict.type.sys_notice_type" :value="scope.row.notice_type" />
          </template>
        </el-table-column>
        <el-table-column label="状态" header-align="center" align="center" prop="status" width="100">
          <template slot-scope="scope">
            <dict-tag :options="dict.type.sys_notice_status" :value="scope.row.status" />
          </template>
        </el-table-column>
        <el-table-column label="创建时间" header-align="center" align="center" prop="create_time" width="100">
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.create_time, '{y}-{m}-{d}') }}</span>
          </template>
        </el-table-column>


      </el-table>
    </div>
    <div class="mb20">
      <pagination v-show="total > 0" :total="total" :page.sync="currentpage" :limit.sync="pagesize"
        @pagination="getList" />
    </div>
    <edit :dialogedit.sync="dialogedit" :notice_id="notice_id+''" @reload="getList" />
  </div>


</template>

<script>
  import {
    listNotice,
    delNotice
  } from "@/api/system/notice";
  import edit from './edit';
  export default {
    name: "Ontice",
    dicts: ['sys_notice_status', 'sys_notice_type'],
    components: {
      edit
    },
    data() {
      return {
        total: 0,
        currentpage: 1,
        pagesize: 100,
        // 岗位表格数据
        tableList: [],
        // 查询参数
        queryParams: {},
        getindex: -1,
        notice_id: 0,
        dialogedit: false
      }
    },

    created() {
      this.getList();
    },
    methods: {
      /** 修改通知通告 */
      EditNotice() {
        if (this.getindex >= 0) {
          let row = this.tableList[this.getindex];
          this.notice_id = row.notice_id;
          this.dialogedit = true;
        }
      },
      /** 新增通知通告 */
      NewNotice() {
        this.notice_id = 0;
        this.dialogedit = true;
      },
      /** 查询登录日志列表 */
      getList() {
        this.getindex = -1;
        var Params = {
          page: this.currentpage,
          pagesize: this.pagesize
        }

        listNotice(Params).then(response => {

          this.tableList = response.rows;
          this.total = parseInt(response.total);
        });

      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.resetForm("queryForm");
        this.handleQuery();
      },
      /** 删除操作 */
      handleDelete() {
        if (this.getindex >= 0) {
          let row = this.tableList[this.getindex];
          const notice_title = row.notice_title;
          var Params = {
            notice_id: row.notice_id
          }
          this.$modal
            .confirm(`是否确认删除?标题:${notice_title}？`)
            .then(function() {
              return delNotice(Params);
            })
            .then(() => {
              this.getList();
              this.$modal.msgSuccess('删除成功');
            })
            .catch(() => {});
        }

      },

      tableRowClassName({
        row,
        rowIndex
      }) {
        row.index = rowIndex;
      },
      getrow(row) {
        this.getindex = row.index;
      }
    }
  };
</script>
